import { lazy,Suspense } from 'react'
import {HashRouter,Route,Routes,Navigate} from 'react-router-dom'

// export  const children = [
//     {
//         path: '/home/Sytype',
//         element: lazy(() => import('../view/Sytype/index')),
//         title: '首页',
//         id:1
//     },
    
// ]

let arr = [
    {
        path: '',
        to:'/login'
    },
    {
        path: '/home',
        element: lazy(() => import('../view/Home/index')),
    },
     {
        path: '/canvas',
        element: lazy(() => import('../view/Canvas/index.js')),
    },
    {
        path: '/rolle',
        element: lazy(() => import('../view/rolle/index.js')),
    },
    {
        path: '/login',
        element:lazy(()=>import('../view/login/index'))
    }
]
const Router = () => {
    return (
       <Suspense fallback={<p>加载中...</p>}>
        <HashRouter>
            <Routes>
                    {
                    arr&&arr.map((item, index) => {
                    return (
                        <Route key={index} path={item.path} element={item.element
                            ?
                            <item.element></item.element>
                            :
                            <Navigate to={item.to}></Navigate>
                        }
                        >
                            {/* {
                                item.children && item.children.length?item.children.map((i, inde) => {
                                    return (
                                <Route key={inde} path={i.path} element={item.element?<item.element></item.element>:<Navigate to={i.to}></Navigate>} ></Route>
                                )
                                }):''
                            } */}
                        </Route>
                    )
                    })
                        
                    }
            </Routes>
        </HashRouter>
        </Suspense>
)
}

export default Router 